<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

<script type="text/javascript" src="Content/js/lib/jquery.js"></script>
<div class="container" style="min-height:700px;">
	<ul class="breadcrumb" style="margin-bottom: 10px;">
		<li><a href="home">Trang chủ</a> <span class="divider">/</span></li>
		<li class="active">Trang chi tiết sách</li>
	</ul>
	<div class="chitietsach">
		<div class="image">
			<img style="max-height:400px;" class="img-polaroid" alt="300x300" src="${book.imageUrl }">
		</div>
		<div class="noidung">
				<div id="name"><h4><c:out value="${book.name }"></c:out></h4></div>
				<table  class="table">
					<tbody>
						<tr><td>Tác giả:</td><td><c:if test="${book.author.name != ''}"><a href="TacGia.do?save=false&tacgiaid=${book.author.authorId}&trang=1&slbooktt=${requestScope.soBookMacDinh}&kieuSort=${requestScope.kieuSapXep}"><c:out value="${book.author.name }"></c:out></a></c:if></td></tr>
						<c:if test="${book.translator.name != ''}"><tr><td>Dịch giả : </td><td><a href="DichGia.do?save=false&dichgiaid=${book.translator.translatorId}&trang=1&slbooktt=${requestScope.soBookMacDinh}&kieuSort=${requestScope.kieuSapXep}"><c:out value="${book.translator.name }"></c:out></a></td></tr></c:if>
						<tr><td>Nhà xuất bản: </td><td><c:if test="${book.publisher.name != ''}"><c:out value="${book.publisher.name }"></c:out></c:if></td></tr>
						<tr><td>Giá: </td><td><c:out value="${book.price }"></c:out> VND</td></tr>
						<tr><td>Ngày XB:</td><td><fmt:formatDate value="${book.publishDay }" pattern="dd/MM/yyyy"/></td></tr>
						<tr><td>Lượt view: </td><td><c:out value="${book.view }"></c:out></td></tr>
						<tr><td></td><td><a href="${book.bookUrl }" target="_blank">Xem link gốc</a></td></tr>
						<tr><td>Số Trang: </td><td><c:out value="${book.pageNum}"></c:out></td></tr>
						<tr><td>Kích Thước: </td><td><c:out value="${book.width }"></c:out> x <c:out value="${book.height }"></c:out></td></tr>		
					</tbody>
				</table>
		</div>
	 </div>
	 <br>
	 <c:if test="${lsize>0 }">
	 	<div class="mycolor"  style="width:90%; height:40px; margin:10px auto; clear:both;"><h4>Những ai xem sách trên, thường xem thêm các sách sau </h4></div>
	 	 <div id="myCarousel" class="carousel slide" style="width:90%; height:320px; margin:5px auto; clear:both;">
          <div class="carousel-inner">
            <div class="item active">
            <c:if test="${lbrelative.size() <4 }">
            	<c:forEach var="book" items="${lbrelative }">
	          			<div class="item_book inline" style="margin:5px 45px;">
							<a href="ChiTietSach.do?bookid=${book.bookId }"><img alt="80x80" src="${book.imageUrl }"  style="width:180px;height:180px;"></a>
							<div class="myrow"><a href="ChiTietSach.do?bookid=${book.bookId }" title="${book.name }"><c:out value="${book.name }"></c:out></a></div>
							<c:if test="${book.author.name != ''}"><div class="myrow">Tác Giả: <a title="${book.author.name }" href="TacGia.do?save=false&tacgiaid=${book.author.authorId}&trang=1&slbooktt=${requestScope.soBookTrenTrang}&kieuSort=${requestScope.kieuSapXep}"><c:out value="${book.author.name }"></c:out></a></div></c:if>
							<c:if test="${ book.translator.name != ''}"><div class="myrow">Người dịch: <a title="${book.translator.name }" href="DichGia.do?save=false&dichgiaid=${book.translator.translatorId}&trang=1&slbooktt=${requestScope.soBookTrenTrang}&kieuSort=${requestScope.kieuSapXep}"><c:out value="${book.translator.name }"></c:out></a></div></c:if>
							<div  class="myrow">Giá: <c:out value="${book.price }"></c:out> VND</div>
						</div>
          			</c:forEach>
            </c:if>
             <c:if test="${lbrelative.size() >= 4 }">
            	<c:forEach var="book" items="${lbrelative }" begin="0" end="3">
	          			<div class="item_book inline"  style="margin:5px 45px;">
							<a href="ChiTietSach.do?bookid=${book.bookId }"><img alt="80x80" src="${book.imageUrl }"  style="width:180px;height:180px;"></a>
							<div class="myrow"><a href="ChiTietSach.do?bookid=${book.bookId }" title="${book.name }"><c:out value="${book.name }"></c:out></a></div>
							<c:if test="${book.author.name != ''}"><div class="myrow">Tác Giả: <a title="${book.author.name }" href="TacGia.do?save=false&tacgiaid=${book.author.authorId}&trang=1&slbooktt=${requestScope.soBookTrenTrang}&kieuSort=${requestScope.kieuSapXep}"><c:out value="${book.author.name }"></c:out></a></div></c:if>
							<c:if test="${ book.translator.name != ''}"><div class="myrow">Người dịch: <a title="${book.translator.name }" href="DichGia.do?save=false&dichgiaid=${book.translator.translatorId}&trang=1&slbooktt=${requestScope.soBookTrenTrang}&kieuSort=${requestScope.kieuSapXep}"><c:out value="${book.translator.name }"></c:out></a></div></c:if>
							<div  class="myrow">Giá: <c:out value="${book.price }"></c:out> VND</div>
						</div>
          			</c:forEach>
            </c:if>
            </div>
            <!-- xuat div tu 2 toi 4 neu co -->
            <c:if test="${lsize>2 }">
            	<c:forEach var="i" begin="1" end="${lsize -2}">
            		<div class="item">
            			<c:forEach var="book" items="${lbrelative }" begin="${i*4 }" end="${i*4+3 }">
            				<div class="item_book inline" style="margin:5px 45px;">
							<a href="ChiTietSach.do?bookid=${book.bookId }"><img alt="80x80" src="${book.imageUrl }"  style="width:180px;height:180px;"></a>
							<div class="myrow"><a href="ChiTietSach.do?bookid=${book.bookId }" title="${book.name }"><c:out value="${book.name }"></c:out></a></div>
							<c:if test="${book.author.name != ''}"><div class="myrow">Tác Giả: <a title="${book.author.name }" href="TacGia.do?save=false&tacgiaid=${book.author.authorId}&trang=1&slbooktt=${requestScope.soBookTrenTrang}&kieuSort=${requestScope.kieuSapXep}"><c:out value="${book.author.name }"></c:out></a></div></c:if>
							<c:if test="${ book.translator.name != ''}"><div class="myrow">Người dịch: <a title="${book.translator.name }" href="DichGia.do?save=false&dichgiaid=${book.translator.translatorId}&trang=1&slbooktt=${requestScope.soBookTrenTrang}&kieuSort=${requestScope.kieuSapXep}"><c:out value="${book.translator.name }"></c:out></a></div></c:if>
							<div  class="myrow">Giá: <c:out value="${book.price }"></c:out> VND</div>
						</div>
            			</c:forEach>
            		</div>
            	
            	</c:forEach>
            </c:if>
             <!-- xuat div tu xuat div cuoi  -->
            <c:if test="${lsize>1}">
            	 <div class="item">
            	 	<c:set var="last" value="${(lsize-1)*4}"></c:set>
           		 	<c:forEach var="book" items="${lbrelative }" begin="${last}" end="${lbrelative.size() }">
	          			<div class="item_book inline" style="margin:5px 45px;">
							<a href="ChiTietSach.do?bookid=${book.bookId }"><img alt="80x80" src="${book.imageUrl }"  style="width:180px;height:180px;"></a>
							<div class="myrow"><a href="ChiTietSach.do?bookid=${book.bookId }" title="${book.name }"><c:out value="${book.name }"></c:out></a></div>
							<c:if test="${book.author.name != ''}"><div class="myrow">Tác Giả: <a title="${book.author.name }" href="TacGia.do?save=false&tacgiaid=${book.author.authorId}&trang=1&slbooktt=${requestScope.soBookTrenTrang}&kieuSort=${requestScope.kieuSapXep}"><c:out value="${book.author.name }"></c:out></a></div></c:if>
							<c:if test="${ book.translator.name != ''}"><div class="myrow">Người dịch: <a title="${book.translator.name }" href="DichGia.do?save=false&dichgiaid=${book.translator.translatorId}&trang=1&slbooktt=${requestScope.soBookTrenTrang}&kieuSort=${requestScope.kieuSapXep}"><c:out value="${book.translator.name }"></c:out></a></div></c:if>
							<div  class="myrow">Giá: <c:out value="${book.price }"></c:out> VND</div>
						</div>
          			</c:forEach>
            	 </div>
            	
            </c:if>  
              
	 		</div>
	 		 <a data-slide="prev" href="#myCarousel" class="left carousel-control">‹</a>
             <a data-slide="next" href="#myCarousel" class="right carousel-control">›</a>
		 </div>
	 </c:if>
	
	
	
	 <div class="noidungsach">
	 	<h3 style="text-decoration:underline;color:#635929; ">Giới thiệu về nội dung</h3><br>			
		 <c:out value="${book.content }" escapeXml="false"></c:out>
	 </div>
	 <div class="noidungcomment">
	 	<div class="mycolor"><h3>Nhận xét</h3></div>	
	 	<div>
	 		<div><h4>Ý kiến của bạn:</h4></div>
	 			<c:if test="${user==null }">
	 				<div style="width:900px;margin:10px; background-color:#d1e7df;height:60px;text-align:center;">
	 					<h5>Bạn phải <a href="DangNhap.do?">Đăng nhập</a> để bình luận hoặc <a href="DangKi.do">Đăng kí</a></h5>
	 				</div>
	 			</c:if>
	 			<c:if test="${user!=null }">
	 				<div style="width:900px;margin:10px;">
						<form class="form-horizontal" action="Comment.do?bookid=${book.bookId }&userid=${user.userId}" method="post">
							<textarea rows="5" cols="80" name="noidungComment" id="noidungComment" style="width:800px;"></textarea><br>
  							 <button type="submit" class="btn">Gửi</button>
						</form>
						
	 				</div>
	 			</c:if> 		
	 	</div>
	 	<div>
	 		<div><h4>Danh sách bình luận</h4></div>
	 		<c:if test="${lcomment==null }"><h3>Hiện tại không có bình luận nào</h3></c:if>
	 		<c:if test="${lcomment!=null }">
	 			<c:forEach var="com" items="${lcomment }">
	 				<div style="width: 800px;background-color:#d1e7df;min-height:40px;margin-top:10px">
	 				<div><span style="color:blue;"><c:out value="${com.user.userId }"></c:out></span>  <fmt:formatDate value="${com.date}"  pattern="HH:mm:ss dd/MM/yyyy"/></div>
	 				"<c:out value="${com.content }"></c:out>"	 		
	 				</div>
	 			</c:forEach>
	 		</c:if>
	 	</div>
	 	
	 </div>
	 
</div>
<script type="text/javascript" src="Content/js/lib/bootstrap.js"></script>